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CHAPTER 1 


PROJECT DESCRIPTION 
1.1 INTRODUCTION 


The term “graphical password” refers to a user authentication method where pictorial 
information is used for validation, instead of an alphanumerical password. This method poses 
many challenges, such as memo ability (which refers to how easy the password is to remember), 
usability, and security, since graphical passwords may tend to be visually simple and easily forged. 
Graphical passwords have become popular due to the proliferation of touch screen devices, in 
particular smart phones and tablets. The prevalent approaches are based on simple graphical 
passwords, which can be easily remembered and reproduced by potential attackers. In this work, 
we study user authentication based on finger -drawn doodles (i.e., free-form gestures or sequences 
of gestures) and on pseudo signatures, which are simplified versions of the signature drawn with 
the finger tip. Authentication is based on features extracted from the dynamics of the gesture 
drawing process (e.g., speed or acceleration).These features contain behavioral biometric 
information, which has been successfully used for automatic user verification based on 
handwritten signatures. As a consequence, a potential attacker would have to copy not only what 
the user draws, but also how the user draws it. Unfortunately, graphical passwords tend to be much 
simpler than signatures and are not composed, in general, of previously learned or heavily 
practiced movements. This can lead to a higher intra-user variability (i.e., variations between 
samples produced by the same person) than in the case of signatures or may cause users to forget 


part of or the whole graphical password. 


A range of approaches for recall-based graphical password authentication have been 
evaluated using measures including resilience to forgeries, memo ability, user acceptance, error 
rates and time to enroll. Recall-based authentication can be divided in two categories. Exact- match 


approaches assume that during authentication, a user produces exactly the same drawing provided 
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during enrollment. Elastic approaches allow some variability between enrollment and 


authentication. Graphical password authentication systems can be also divided into static and 
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dynamic approaches. Static or offline systems use the doodle image for authentication, while 


dynamic or online systems use time functions extracted from the doodle trajectory. 
1.2 EXISTING SYSTEM 


Authentication based on passwords is used largely in applications for computer security 
and privacy. However, human actions such as choosing bad passwords and inputting passwords in 
an insecure way are regarded as “the weakest link” in the authentication chain. Rather than 
arbitrary alphanumeric strings, users tend to choose passwords either short or meaningful for easy 
memorization. With web applications and mobile apps piling up, people can access these 
applications anytime and anywhere with various devices. This evolution brings great convenience 
but also increases the probability of exposing passwords to shoulder surfing attacks. Attackers can 
observe directly or use external recording devices to collect users’ credentials. To overcome this 
problem, we proposed a novel authentication system Pass Matrix, based on graphical passwords 
to resist shoulder surfing attacks. With a one-time valid login indicator and circulative horizontal 
and vertical bars covering the entire scope of pass-images, Pass Matrix offers no hint for attackers 


to figure out or narrow down the password even they conduct multiple camera-based attacks. 
DISADVANTAGES 
e Assumed that the server and the client devices in our authentication system are 
trustworthy. 
e Assumed that the surveillance cameras that are not under proper management. 


1.3 PROPOSED METHOD 


Proposing system uses graphical passwords for authentication purposes. User has to 
register with the username and password. Then a list of five images will be displayed. User has to 
select an image. The selection of pixel points on the image for users will vary according to the 
group, they belong. At the time of login, user can login using the password or image. If the 
password method is selected, the user has to enter the password. An OTP will be sent to the 
registered mail id. When the OTP is entered correctly, the user’s home page will be displayed. If 
the image method is selected, the user has to select an image from the list of five images. After 
selecting the correct image, the specified number of pixel points should be marked correctly. If 


this step is correct, the user’s home page is displayed. 
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ADVANTAGES 


e Can’t predict accurately when there are five images. 


e OTP is used for unique identification. 


1.3.1 HARDWARE REQUIREMENTS 


e Processor : Dual core processor 2.6.0 GHZ 
e RAM : 1GB 

e Hard disk : 160 GB 

e Compact Disk : 650 Mb 

e Keyboard : Standard keyboard 

e Monitor : 15 inch color monitor 


1.3.2 SOFTWARE REQUIREMENTS 


e Front End : JSP 

e Back End : SQL Server 2008 

e Platform : Windows 7 

e IDE : Net beans 
FRONT END (JSP): 


Java Server Page (JSP) is a technology for controlling the content or appearance of Web 
pages through the use of servlets, small programs that are specified in the Web page and run on 
the Web server to modify the Web page before it is sent to the user who requested it. Sun 
Microsystems, the developer of Java, also refers to the JSP technology as the Servlet application 
program interface (API). JSP is comparable to Microsoft's Active Server Page (ASP) technology. 
Whereas a Java Server Page calls a Java program that is executed by the Web server, an Active 
Server Page contains a script that is interpreted by a script interpreter (such as VBScript or JScript) 


before the page is sent to the user. Architecturally, JSP may be viewed as a high-level 
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abstraction of Java servlets. JSPs are translated into servlets at runtime, therefore JSP is a Servlets; 
each JSP servlet is cached and re-used until the original JSP is modified.JSP can be used 
independently or as the view component of a server-side model-view—controller design, normally 
with JavaBeans as the model and Java servlets (or a framework such as Apache Struts) as the 
controller. This is a type of Model 2 architecture. 

JSP allows Java code and certain pre-defined actions to be interleaved with static web 
markup content, such as HTML, with the resulting page being compiled and executed on the server 
to deliver a document. The compiled pages, as well as any dependent Java libraries, contain Java 
byte code rather than machine code. Like any other Java program, they must be executed within a 
Java virtual machine (JVM) that interacts with the server's host operating system to provide an 
abstract, platform-neutral environment. JSPs are usually used to deliver HTML and XML 
documents, but through the use of OutputStream, they can deliver other types of data as well. The 
Web container creates JSP implicit objects like request, response, session, application, config, 
page, pageContext, out and exception. JSP Engine creates these objects during translation phase. 
SYNTAX 

JSP pages use several delimiters for scripting functions. The most basic is <% ... %>, which 
encloses a JSP scriptlet. A scriptlet is a fragment of Java code that is run when the user requests 
the page. Other common delimiters include <%= ... %> for expressions, where the scriptlet and 
delimiters are replaced with the result of evaluating the expression, and directives, denoted with 
<%@ ... %>.Java code is not required to be complete or self-contained within a single scriptlet 
block. It can straddle markup content, provided that the page as a whole is syntactically correct. 
For example, any Java if/for/while blocks opened in one scriptlet must be correctly closed in a 
later scriptlet for the page to successfully compile. Content which falls inside a split block of Java 
code (spanning multiple scriptlets) is subject to that code. Content inside an if block will only 
appear in the output when the if condition evaluates to true. Likewise, content inside a loop 
construct may appear multiple times in the output, depending upon how many times the loop body 
runs. 

COMPILER 
A Java Server Pages compiler is a program that parses JSPs, and transforms them into 


executable Java Servlets. A program of this type is usually embedded into the application server 
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and run automatically the first time a JSP is accessed, but pages may also be precompiled for better 
performance, or compiled as a part of the build process to test for errors. Some JSP containers 
support configuring how often the container checks JSPs files timestamps to see whether the page 
has changed. Typically, this ttmestamp would be set to a short interval (perhaps seconds) during 
software development, and a longer interval (perhaps minutes, or even never) for a deployed Web 
application. 

5.2 ABOUT MY-SQL 

Introduction 

MySQL is the world's most used open source relational database management system 
(RDBMS) as of 2008 that run as a server providing multi-user access to a number of databases. 
The MySQL development project has made its source code available under the terms of the GNU 
General Public License, as well as under a variety of proprietary agreements. MySQL was owned 
and sponsored by a single for-profit firm, the Swedish company MySQL AB, now owned by 
Oracle Corporation. 

MySQL is a popular choice of database for use in web applications, and is a central 
component of the widely used LAMP open source web application software stack—LAMP is an 
acronym for "Linux, Apache, MySQL, Perl/PHP/Python." Free-software-open source projects that 
require a full-featured database management system often use MySQL. 

For commercial use, several paid editions are available, and offer additional functionality. 
Applications which use MySQL databases include: TYPO3, Joomla, Word Press, phpBB, MyBB, 
Drupal and other software built on the LAMP software stack. MySQL is also used in many high- 
profile, large-scale World Wide Web products, including Wikipedia, Google (though not for 
searches), ImagebookTwitter, Flickr, Nokia.com, and YouTube. 

Inter Images 

MySQL is primarily an RDBMS and ships with no GUI tools to administer MySQL 
databases or manage data contained within the databases. Users may use the included command 
line tools, or use MySQL "front-ends", desktop software and web applications that create and 
manage MySQL databases, build database structures, back up data, inspect status, and work with 
data records. The official set of MySQL front-end tools, MySQL Workbench is actively developed 
by Oracle, and is freely available for use. 


Graphical 
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The official MySQL Workbench is a free integrated environment developed by MySQL 
AB, which enables users to graphically administer MySQL databases and visually design database 
structures. MySQL Workbench replaces the previous package of software, MySQL GUI Tools. 
Similar to other third-party packages, but still considered the authoritative MySQL frontend, 
MySQL Workbench lets users manage database design & modeling, SQL development (replacing 
MySQL Query Browser) and Database administration (replacing MySQL Administrator). MySQL 
Workbench is available in two editions, the regular free and open source Community Edition 
which may be downloaded from the MySQL website, and the proprietary Standard Edition which 
extends and improves the feature set of the Community Edition. 
Command Line 

MySQL ships with some command line tools. Third-parties have also developed tools to 
manage a MySQL server, some listed below. Maatkit - a cross-platform toolkit for MySQL, 
PostgreSQL and Memcached, developed in Perl Maatkit can be used to prove replication is 
working correctly, fix corrupted data, automate repetitive tasks, and speed up servers. Maatkit is 
included with several GNU/Linux distributions such as CentOS and Debian and packages are 
available for Programming. MySQL works on many different system platforms, including AIX, 
BSDi, FreeBSD, HP-UX, eComStation, i5/OS, IRIX, Linux, Mac OS X, Microsoft Windows, 
NetBSD, Novell NetWare, OpenBSD, OpenSolaris, OS/2 Warp, QNX, Solaris, Symbian, SunOS, 
SCO Open Server, SCO UnixWare, Sanos and Tru64. A port of MySQL to OpenVMS also exists. 

MySQL is written in C and C++. Its SQL parser is written in yacc, and a home-brewed 
lexical analyzer. Many programming languages with language-specific APIs include libraries for 
accessing MySQL databases. These include MySQL Connector/Net for integration with 
Microsoft's Visual Studio (languages such as C# and VB are most commonly used) and the JOBC 
driver for Java. In addition, an ODBC inter image called MyODBC allows additional programming 
languages that support the ODBC inter image to communicate with a MySQL database, such as 
ASP or ColdFusion. The HTSQL - URL-based query method also ships with a MySQL adapter, 
allowing direct interaction between a MySQL database and any web client via structured URLs. 


Features 
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As of April 2009, MySQL offered MySQL 5.1 in two different variants: the open source MySQL 
Community Server and the commercial Enterprise Server. MySQL 5.5 is offered under the same 
licenses. They have a common code base and include the following features: 


° A broad subset of ANSI SQL 99, as well as extensions 


e Cross-platform support 
e Stored procedures 

e Triggers 

e Cursors 


e Updatable Views 


e Information schema 
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CHAPTER 2 


LOGICAL DEVELOPMENT 


2.1 DATA FLOW DIAGRAM 


A two-dimensional diagram explains how data is processed and transferred in a system. 
The graphical depiction identifies each source of data and how it interacts with other data sources 
to reach a common output. Individuals seeking to draft a data flow diagram must identify external 
inputs and outputs, determine how the inputs and outputs relate to each other, and explain with 
graphics how these connections relate and what they result in. This type of diagram helps business 
development and design teams visualize how data is processed and identify or improve certain 


aspects. 


LEVEL 0 


DFD Level 0 is also called a Context Diagram. It’s a basic overview of the whole system 
or process being analyzed or modeled. It’s designed to be an at-a-glance view, showing the system 
as a single high-level process, with its relationship to external entities. It should be easily 
understood by a wide audience, including stakeholders, business analysts, data analysts and 


developers. 


Secured Login 


login 
System 


User 


Verification 
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LEVEL 1 


DFD Level | provides a more detailed breakout of pieces of the Context Level Diagram. 
You will highlight the main functions carried out by the system, as you break down the high- level 


process of the Context Diagram into its sub — processes. 
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2.2 ARCHITECTURAL DIAGRAM 


The architecture used in this project is a three tier architecture, which comprises of the presentation 
tier, logical tier and the data tier. Below is the architecture diagram of the system: Fig 2. System 
Architecture Registration The users of the system have to firstly register with the application before 
going ahead and logging into it. The registration consists of firstly choosing the set of images that 
the user desires for setting the password, out of each those images the user selects the area in the 
image which least likely guessable. For more security the user also gives a text password which 
will in turn be hidden in the set of images that the user had selected before this will be done by the 
concept of image steganography. Image Steganography Image steganography is performed during 
the registration and login process of the application. It is the process of hiding a data within 
another. If any type of data such as image, text etc. are hidden within an image, it is known as 
image steganography. During registration process, a textual password is asked from the user, 


which is then\ 


Stored within the images. While the login process, the user is asked to re-enter the password, which 
will then be compared with the one retrieved from the image. If the retrieved password matches 
with the one stored during the login process, the user is considered authenticated. Login Process 
during logging in the user is asked to type the text password which is matched to the text which 
will be retrieved from the images which was stored during the registration. Along with the text, 
the images that the user had selected during the registration will be displayed out of which the user 


will have to click on the same areas that were clicked before. 
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CHAPTER 3 


DATABASE DESIGN 
3.1 DATA DICTIONARY 


Database jsp_graphical_password 


Field |Type Null| Default 


id varchar(35)|Yes |NULL 


accnumber|varchar(35)|Yes | NULL 


name varchar(35)|Yes |NULL 


pass varchar(35) Yes |NULL 


deposit varchar(35)|Yes |NULL 


rdate varchar(35)|Yes |NULL 


report varchar(35) Yes |NULL 


status varchar(35)|Yes | NULL 


balance varchar(35)|Yes | NULL 
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3.2 TABLE DESIGN 


Dumping data for table amount 


1}123123]arun | 123)0} 19-11-2019/0)/0/800 
2) 123 sham] 123}0} 19-11-2019} 0}0/600 
Table structure for table mini 

Field |Type Null| Default 
id int(10) Yes |INULL 
name varchar(35)| Yes NULL 
laccnumber]varchar(35)| Yes [NULL 
evnt varchar(35)|Yes |NULL | 
amount __ |varchar(35)|Yes |NULL 
trans_to  |varchar(35)|Yes |NULL 
rdate varchar(35)|Yes | NULL 
report varchar(35) Yes |NULL 
publickey |varchar(50)/Yes | NULL 
privatekey |varchar(50)|Yes | NULL 
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Dumping data for table mini 


1 jarun 


123123 


trans_to 


100]123 


20-11-2019 


— 


2 |sham 


123 


trans_from 


100} 123123 


20-11-2019 


S 


Table structure for table user_reg 


Field |Type Null|Default 
id int(20) Yes JNULL 
name varchar(100)|Yes |NULL 
contact |varchar(100)|Yes |NULL 
email — |varchar(100)|Yes |NULL 
accno varchar(100)| Yes NULL 
cardno |varchar(100)) Yes [NULL 
date | varchar(100)| Yes [NULL 
bank varchar(100)|Yes |NULL 
branch — |varchar(100)| Yes |NULL 
address |varchar(100)|Yes |NULL 
uname _ |varchar(100)| Yes |NULL 
pass varchar(100)| Yes |NULL 
cdate varchar(100)|Yes |NULL 
xl varchar(100)|Yes |NULL 
yl varchar(100)| Yes |NULL 
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x2 varchar(100)| Yes |NULL 
y2 varchar(100)| Yes [NULL 
x3 varchar(100)| Yes |NULL 
y3 varchar(100)| Yes |NULL 
image |varchar(100)| Yes NULL 
status | varchar(100)| Yes [NULL 
report |varchar(100)| Yes |NULL 
pub_key |varchar(100)| Yes |NULL 
priv_key|varchar(100)| Yes |NULL 


Dumping data for table user_reg 


19 
a (yi fd ft ft ft 
|e 73393 |arunextazee@ |123 |987654321 |20-]° |tric [tric lar 11 1 ibh 98 |80 
un |33830 [gmail.com 123 |0123456 = |O1-]. hy {hy fun |, |- 70 |0 
i 4 }3 |2 |5 
01 20 
19 
19 
20 - 
2 |2 |2 |2 |2 \2 
qsh 73393 |sham@ gmail. 123 987654321 20.) tric |tric sh 11 ah ibh 3 98 
am|33830 |com 0123456 |11-). {hy |hy Jam], |- 70 |70 
i 1 /2 |1 JO JS [2 
28 20 
19 
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3.3 RELATIONSHIP DIAGRAM 


An entity—relationship model (ER model for short) describes interrelated things of interest in a 
specific domain of knowledge. A basic ER model is composed of entity types (which classify the 
things of interest) and specifies relationships that can exist between entities (instances of those 
entity types). In software_engineering, an ER model is commonly formed to represent things a 
business needs to remember in order to perform business processes. Consequently, the ER model 
becomes an abstract data_model, that defines a data or information structure which can be 
implemented in a database, typically a relational database 


DATABASE ( IMAGES ) 
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Fig 3.3.3erdiagram 
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CHAPTER 4 


PROGRAM DESIGN 
4.1 MODULE DESCRIPTIONS 


4.1.1 USER REGISTRATION 


User has to register with the username, password and other details. Then, it is followed by 
selection of image from the list of five details. Select three points on the selected image. Then, 


click register button. The entered details will be saved in a server. 
4.1.2 USER LOGIN WITH PASSWORD 


User has to login with the username first. Then the user has to choose either the password 
method or the graphical password method. Select the password method. Enter the password. An 
OTP will be sent to the registered mail. Enter the OTP and click submit button. User’s homepage 
will be displayed. 


4.1.3 USER LOGIN WITH IMAGE 


User has to login with the username first. Then the user has to choose either the password 
method or the graphical password method. Select the graphical password method. Select the 
correct image from the list of five images. Select the three points and click submit button. User’s 


homepage will be displayed. 


20|Page 


CHAPTER 5 
SYSTEM TESTING 


5.1.1 UNIT TESTING 


The first test in the development process is the unit test. The source code is normally 
divided into modules, which in turn are divided into smaller units called units. These units have 
specific behavior. The test done on these units of code is called unit test. Unit test depends upon 


the language on which the project is developed. 


Unit tests ensure that each unique path of the project performs accurately to the 
documented specifications and contains clearly defined inputs and expected results. Functional 
and reliability testing in an Engineering environment. Producing tests for the behavior of 
components (nodes and vertices) of a product to ensure their correct behavior prior to system 


integration. 


In this testing, user registration is done and checked for errors. User registration is done 


successfully. 
5.1.2 INTEGRATION TESTING 


Testing is which modules are combined and tested as a group. Modules are typically code 
modules, individual applications, source and destination applications on a network, etc. Integration 
Testing follows unit testing and precedes system testing. Testing after the product is code 
complete. Betas are often widely distributed or even distributed to the public at large in hopes that 


they will buy the final product when it is release. 


In this testing, user login is checked. When user enters all the details correctly, user home 


will be displayed. 


21|Page 


CHAPTER 6 
CONCLUSION 


User authentication is a fundamental component in most computer security contexts. In 
this extended abstract, proposed a simple graphical password authentication system. The system 
combines image selection and pixel selection concepts and forms as a single method. This method 
is more secured as pixel selection can’t be identified easily. Computational cost and space 
complexity are less for the proposed method. As a future work, restrictions for image selection can 
be fixed. This provides complete security. The only limitation with graphical passwords is the slow 


mapping process as size of high quality images increases. 
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CHAPTER 8 


APPENDICES 


8.1 —-SOURCE CODE 


<!doctype html> 

<html> 

<head> 

<meta http-equiv="Content-Type" content="text/html; charset=utf- 
chau ee 

<title>CC</title> 

<link rel="stylesheet" href="styles.css" type="text/css" /> 
<!--[if lt IE 9]> 

<script 
src="http://html5shiv.googlecode.com/svn/trunk/htm15.js"></scrip 
t> 

<![endif]--> 

pS al 

adage, a free CSS web template by ZyPOP (zypopwebtemplates.com/) 


Download: http://zypopwebtemplates.com/ 


License: Creative Commons Attribution 

Soo 

<meta name="viewport" content="width=device-width, minimum- 
scale=1.0, maximum-scale=1.0" /> 

</head> 

<body> 


<div id="container" class="width"> 
<header> 


<hl><a href="">Credit<span> Card 
Maintenance</span></a></h1> 


</header> 
<nav> 
<div class="inner-nav"> 
<ul> 
<li class="start selected"><a 


href="index.jsp">Home</a></1li> 
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<li class=""><a href="user.jsp">User</a></1li> 


<li class=""><a href="admin.jsp">Admin</a></1i> 


</ul> 
</div> 
</nav> 


<div id="body"> 


<section id="content"> 


<article> 
<div class="article-info"><div align="right"> 
<table width="200" border="0"> 


<tr> 


<td><h2 align="center">Introduction to Secure Bank 
Transaction</h2></td> 

<td><div align="right"><imgsrc="images/medicalrecordscan- 
logo.png" width="200" height="80"></div></td> 


</tr> 
</table> 
</div> 
</div> 
</article> 


<article class="expanded"> 

<p align="justify"> A credit card is different froma 
charge card, which requires the balance to be repaid in full 
each month. In contrast, credit cards allow the consumers a 
continuing balance of debt, subject to interest being charged. 
credit card also differs from a cash card, which can be used 
like currency by the owner of the card. </p> 


<h3>Secure Bank</h3> 


<p align="justify">A bank is a financial institution that 
accepts deposits from the public and creates credit. Lending 
activities can be performed either directly or indirectly 
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through capital markets. Due to their importance in the 
financial stability of a country, banks are highly regulated in 
most countries. Most nations have institutionalized a system 
known as fractional reserve banking under which banks hold 
liquid assets equal to only a portion of their current 
liabilities.</p> 


</article> 
</section> 


<aside class="sidebar"> 


<ul> 

<li> 

<h4><span>Categories</span></h4> 

<ul> 

<li><a href="index.jsp">Home Page</a></1li> 

<Lipka, DESr="User. Teg... sp User 


Registration</a></li> 
<li><a href="user.jsp">User Login</a></1li> 
<li><a href="admin.jsp">Admin Login</a></1li> 
</> 

</li> 


<li> 

<h4><span>About us</span></h4> 

<ul> 

<li class="text"> 

<div align="justify">Elliptic-curve cryptography (ECC) is an 
approach to public-key cryptography based on the algebraic 
structure of elliptic curves over finite fields. 

<p style="margin: 0;">é&nbsp;</p> 

</div> 

</li> 

</ul> 

iy fears 


<li></li> 

<li> 

<h4><span>Helpful Links</span></h4> 
<ul> 


<li><a href="index.jsp" title="premium 
templates">Home</a></1i> 
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<li><a href="about.jsp" title="web hosting">About As</a></li> 
<li><a href="contact.jsp" 

title="premium templates">Contact As</a></li> 

Cable 

</li> 

</ul> 

</aside> 

<div class="clear"></div> 

</div> 

<footer> 

<div class="footer-bottom"> 

<p>&copy; YourSite 2019. <a href="index.jsp">CCM</a></p> 

</div> 


</footer> 

<j Gin> 

</body> 

</html> 

<% 

try 

{ 

session.removeAttribute ("username") ; 
session.removeAttribute ("name") ; 
session.removeAttribute ("pu_key") ; 
session.removeAttribute ("pri_key"); 
session.removeAttribute ("dest") ; 
response. sendRedirect ("index.jsp"); 


} 


catch (Exception e) 


<%$@include file="include/dbconnect.jsp" %> 


<S 

String sid=(String) session.getAttribute ("id"); 
String imgid="1"; 

String cid=request.getParameter ("id"); 
//out.print (sid); 
//stmtl.executeUpdate ("updat 
id='"4+sidt"'"); 
//response.sendRedirect ("user reg 3.jsp"); 


user reg set image=""+cid+"" where 


oe 


> 
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<html> 

<head> 
<title>Cc</title> 
<meta charset="UTF-8"> 


<meta name="viewport" content="width=device-width"> 
<script type="text/javascript"> 
a ai 


functionFindPosition (oKlement) 
{ 
if (typeof( oElement.offsetParent ) != “undefined") 
{ 
for(varposxX = 0, posY = 0; oEFlement; oEFlement = 
oRlement.offsetParent) 
{ 
posX += oFlement.offsetLeft; 
posY += oFlement.offsetTop; 
} 
return [ posxX, posY ]; 
} 
else 
{ 
return [ oEBlement.x, oFlement.y ]; 
} 
} 


functionGetCoordinates (e) 
{ 

varPosx = 0; 

varPosyY = 0; 


varimgPos; 

ImgPos = FindPosition (myImg) ; 
if (!e) var e = window.event; 
if (e.pagexX || e.pageyY) 


{ 
PosX = e.pageX; 
PosY = e.pageY; 
} 


else if (e.clientX || e.clientyY) 
{ 
PosX = e.clientX document.body.scrollLeft 
+ document.documentElement.scrollleft; 
PosY = e.clienty document .body.scrollTop 
+ document.documentElement.scrollTop; 


} 
Posx 
Posy 


PosxX - ImgPos[0]; 
PosY - ImgPos[1]; 
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document.getElementBylId("x") .innerHTML = PosX; 
document.getHlementBylId("y") .innerHTML = PosyY; 


Lf=> 

</SCript> 

</head> 

<body> 

<img id="myImgId" alt="" src="download.jpg" width="400" 
height="300" /> 


<script type="text/javascript"> 

se aaa 

varmyImg = document.getElementBylId("myImgId") ; 
myIimg.onmousedown = GetCoordinates; 

f[=s> 

</seript> 


<imgsrc="red.gif" width="400" height="300" alt="""id="myImgId" 
/> 

<p>X:<span id="x"></span></p> 

<p>Y¥:<span id="y"></span></p></body> 

</html> 


<%@ include file="include/dbconnect.jsp" %> 
<s@page import="jJava.util.Random"%> 
<%@page import="java.sql.ResultSet"%> 


try 


String a=request.getParameter ("btn"); 
if (a.equals ("Submit") ) 
{ 


String name=request.getParameter ("uname") ; 
String pass=request.getParameter ("pass") ; 
out.print (name+""+pass) ; 

String qry="select * from user reg where uname='"+namet"' && 
pass='"+passt"! "; 
ie: out.print (qry); 

ResultSetrs=stmt.executeQuery(qry); 

if (rs.next()) 


{ 


String sid=rs.getString ("id"); 
String img=rs.getString ("image") ; 
String xl=rs.getString("x1"); 
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String yl=rs.getString("yl"); 
String x2=rs.getString("x2"); 
String y2=rs.getString("y2"); 
String x3=rs.getString("x3"); 
String y3=rs.getString("y3"); 
String accno=rs.getString("accno") ; 
session.setAttribute ("accno",accno) ; 
session.setAttribute("sid",sid); 
session.setAttribute("img", img) ; 
session.setAttribute ("uname",name) ; 
session.setAttribute("x1",x1l); 
session.setAttribute("yl",yl); 
session.setAttribute("x2",x2); 
session.setAttribute("y2",y2); 
session.set ); 


session.set 
session.set 
session.set 


ttribute ("y3",y3)3 
ttribute 
ttribute 


( 

( 

( 
ttribute("x3",x3 

( 

( 

( 


response.sendRedirect ("user 1.jsp"); 


} 


else 


{ 


oe 
V 


<script language="javascript"> 
alert ("user name/ pass Rong!"); 


window. location="user.jsp"; 
</seript> 


A 
foe) 


rs.close(); 


}catch (Exception e) 


{ 


//out.print (e); 
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S> 

<S@page contentType="text/html" pageEncoding="UTF-8"%> 

<!doctype html> 

<html> 

<head> 

<meta http-equiv="Content-Type" content="text/html; charset=utf- 
oe ye 

<title>CC</title> 

<link rel="stylesheet" href="styles.css" type="text/css" /> 
<!--[if lt IE 9]> 

<script 
src="http://html5shiv.googlecode.com/svn/trunk/htm15.js"></scrip 
t> 

<![endif]--> 

<b-= 

adage, a free CSS web template by ZyPOP (zypopwebtemplates.com/) 


Download: http://zypopwebtemplates.com/ 


License: Creative Commons Attribution 
ae 
<meta name="viewport" content="width=device-width, minimum- 


scale=1.0, maximum-scale=1.0" /> 
<style type="text/css"> 
<!-- 
.style2 {color: #2E6290; font-weight: bold; } 
.style3 { 

color: #FA8B37; 

font-weight: bold; 


} 

--> 

</style> 

</head> 

<body> 

<div id="container" class="width"> 


<header> 


<hl><a href="">Credit<span> Card 
Maintenance</span></a></h1> 


</header> 
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<nav> 
<div class="inner-nav"> 
<ul> 
<li class="Start selected"><a 
href="index.jsp">Home</a></1li> 
<li class="Start selected"><a 
href="user.jsp">User</a></1li> 


<li class=""><a href="admin.jsp">Admin</a></1li> 


</ul> 
</div> 
</nav> 


<div id="body"> 


<section id="content"> 


<article> 
<div class="article-info"><div align="right"> 
<table width="200" border="0"> 


<tr> 


<td><h2 align="center">User Login </h2></td> 
<td><div align="right"><imgsrc="images/user-512.png" width="152" 
height="80"></div></td> 


</tr> 
</table> 
</div> 
</div> 
</article> 


<article class="expanded"> 


<form name="forml" method="post" action=""> 
<table width="60%" border="0"> 


<tr> 


td width="23%">é&nbsp; </td> 

td width="57%"><table width="61%" border="0" align="center"> 
tr> 
td width="35%" class="tdsh"><div align="center" class="style2"> 


a 
be 
a 
o 
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<div align="right">User name </div> 
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</div></td> 
<td width="8%" class="tdsh"><div align="center" 
class="style2">:</div></td> 
<td width="57%" class="tdsh"><label> 
<input name="uname" type="text" id="uname"> 
</label></td> 
SPL 
<tr> 
<td class="tdsh"><div align="center" class="style2"> 
<div align="right">Password</div> 
</aiys</ ca 
<td class="tdsh"><div align="center" class="style2">:</div></td> 
<td class="tdsh"><label> 
<input name="pass" type="password" id="pass"> 
</label></td> 
<[EEe 
<tr> 
<td class="tdsh">énbsp; </td> 
<td colspan="2" class="tdsh"><label> 
<input name="btn" type="Submit" class="btncelr" id="btn" 
value="Submit"> 
<span class="style3"><a hret="user: reg.jsp">New 
user...</a></span></label></td> 
</tr> 
</table></td> 
<td width="20%">é&nbsp; </td> 
qf tes 
</table> 
</form> 
<p align="justify">énbsp; </p> 
</article> 
</section> 


<aside class="sidebar"> 


<ul> 
<li> 
<h4><span>Categories</span></h4> 
<ul> 
<li><a href="index.jsp">Home Page</a></1li> 
<li><a: hrer="user req. 7sp">User 


Registration</a></li> 

<li><a href="user.jsp">User Login</a></1li> 
<li><a href="admin.jsp">Admin Login</a></1li> 
</ul> 

</li> 
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<li> 
<h4><span>Helpful Links</span></h4> 
soy aes 


<li><ul> 
<li><a href="index.jsp" title="premium 
templates">Home</a></1i> 


<li><a href="about.jsp" title="web hosting">About As</a></li> 
<li><a href="contact.jsp" 
title="premium templates">Contact As</a></li> 
</ul> 
</li> 
</ul> 
</aside> 
<div class="clear"></div> 
</div> 
<footer> 
<div class="footer-bottom"> 
<p>&copy; YourSite 2019. <a href="index.jsp">CCM</a></p> 
</div> 
</footer> 
</div> 
</body> 
</html> 
<S@page import="Java.util.Random"%> 
<%@ include file="include/dbconnect.jsp" %> 


<S% 
String sid=(String) session.getAttribute ("sid"); 


foe) 


> 


<!doctype html> 

<html> 

<head> 

<meta http-equiv="Content-Type" content="text/html; charset=utf- 
8 Yo 

<title>CC</title> 

<link rel="stylesheet" href="styles.css" type="text/css" /> 
<!--[if lt IE 9]> 

<script 
src="http://htmlL5shiv.googlecode.com/svn/trunk/htm15.js"></scrip 
t> 

<![endif]--> 

<a 
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adage, a free CSS web templa 


te by ZyPOP (zypopwebtemplates.com/) 


Download: http://zypopwebtemplates.com/ 


License: Creative Commons At 


Eee 


tribution 


<meta name="viewport" conten 
scale=1.0, maximum-scale=1.0 
<style type="text/css"> 


.stylel {color: #2E6290} 
-style2 {font-weight: bold} 


</style> 
<script language="javascript 
function validate () 

{ 

ff. BLEVE CI 

if (document.forml.name.valu 
{ 
alert ("Enter the Name"); 
document. forml.name.focus(); 
return false; 


} 
if (document.forml.cont.valu 
{ 
alert ("Enter the Contact"); 
document. forml.cont.focus(); 
return false; 


} 


if (document.forml.cont.valu 


{ 


t="width=device-width, minimum- 
W /> 


Wess. 


e —— wee ) 


e — wee ) 


e = wt) 


var z = document.forml.cont.value; 


TELS [0-9 S7 best (z)) 4 


alert ("enter 0-9") 


document. forml.cont.focus(); 
return false; 


} 


if (document.forml.cont.valu 


{ 


e != wee). 


var a=document.forml.cont.value; 


Lf (an bength ==10))) f/togot 
{ 
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a problem with this one i think 


alert ("Enter 10 character length"); 
document. forml.cont.focus(); 


return false; 


} 


a 


orml.email.value == my) 


{ 
alert ("Enter the email"); 


document.forml.email.focus(); 
return false; 


1f (document. 


} 
1f (document.forml.email.value != "") 

{ 
varmailformat = /*\wt([\.-]?\wt) *@\w+t([\.-] ?\wt) *(\.\w{2,3})+$/; 
if (document.forml.email.value.match (mailformat) ) 


{ 


LSe 


} 
e] 
{ 
alert ("You have entered an invalid email address!"); 
document.forml.email.focus(); 

return false; 


} 


} 
if (document.forml.address.value == "") 
{ 
alert ("Enter the address"); 
document.forml.address. focus (); 
return false; 


} 
if (document.forml.uname.value == "") 
{ 
alert ("Enter the uname"); 
document.forml.uname. focus (); 
return false; 


} 


if (document.forml.pass.value == "") 

{ 

alert ("Enter the pass"); 
document.forml.pass.focus(); 

return false; 

}if (document.forml.cpass.value == "") 


{ 
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alert ("Enter 


document. 


Pang 


orm] 


the conform pass"); 
.cpass.focus(); 


return false; 


return 


Crue; 


AP SCTIPE 


</head> 
<body> 


> 


} 


//finishMD(); 


<div id="container" class="width"> 


<header> 


<hl><a href="">Credit<span> Card 


Maintenance</span></a></h1> 


</header> 
<nav> 
<div class="inner-nav"> 
<ul> 
<li class="start selected"><a 


href="index.jsp">Home</a></1li> 


href="user. J 


<li 


<li 


class="Start selected"><a 


sp">User</a></li> 


class=""><a href="admin.jsp">Admin</a></1li> 


class=""><a href="about.jsp">About As</a></1li> 


class=""><a href="contact.jsp">Contact</a></li> 


</ul> 
</div> 


</nav> 


<div id="body"> 
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<section id="content"> 


<article> 
<div class="article-info"><div align="right"> 
<table width="200" border="0"> 


<UL> 


<td><h2 align="center">User Login </h2></td> 
<td><div align="right"><imgsrc="images/user-512.png" width="152" 
height="80"></div></td> 


</tr> 
</table> 
</div> 
</div> 
</article> 


<article class="expanded"> 


<form name="forml" method="post" action=""> 
<table width="60%" border="0"> 

CES 
<td width="16%">é&nbsp; </td> 
<td width="64%3"><table width="597" height="263" border="0" 
align="center"> 
Soh aes 
<td><a href="user 2.jsp?id=1"><imgsrc="img/1.png" width="100" 
height="100"></a></td> 
<td><a href="user 2.jsp?id=2"><imgsrc="img/2.png" width="100" 
height="100"></a></td> 
<td><a href="user 2.jsp?id=3"><imgsrc="img/3.png" width="100" 
height="100"></a></td> 
<td><a href="user 2.jsp?id=4"><imgsrc="img/4.png" width="100" 
height="100"></a></td> 
<td><a href="user 2.jsp?id=5"><imgsrc="img/5.png" width="100" 
height="100"></a></td> 
<fene 

tr> 

td class="tdsh"><a href="user 2.jsp?id=6"><imgsrc="img/6.png" 


Z 
<1 S= 

width="100" height="100"></a></td> 

<td class="tdsh"><a href="user 2.jsp?id=7"><imgsrc="img/7.png" 
width="100" height="100"></a></td> 

<td class="tdsh"><a href="user 2.jsp?id=8"><imgsrc="img/8.png" 
width="100" height="100"></a></td> 

<td class="tdsh"><a href="user 2.jsp?id=9"><imgsrc="img/9.png" 
width="100" height="100"></a></td> 

<td class="tdsh"><a href="user 2.jsp?id=10"><imgsrc="img/10.png" 
width="100" height="100"></a></td> 

A Ges 


</table></td> 
<td width="20%">é&nbsp; </td> 
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ea 
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</table> 
</form> 
<p align="justify">énbsp; </p> 
</article> 
</section> 


<aside class="sidebar"> 


<ul> 
<li> 
<h4><span>Categories</span></h4> 
<ul> 
<li><a href="index.jsp">Home Page</a></1li> 
Sli pKa hrer="Uuser “reg. sp" >User 


Registration</a></li> 

<li><a href="user.jsp">User Login</a></1li> 
<li><a href="admin.jsp">Admin Login</a></li> 
<UL 

</li> 


<li> 
<h4><span>Helpful Links</span></h4> 
ay aS 
<li><ul> 
<li><a href="index.jsp" title="premium 
templates">Home</a></1i> 


<li><a href="about.jsp" title="web hosting">About As</a></li> 
<li><a href="contact.jsp" 
title="premium templates">Contact As</a></li> 
<ul> 
</li> 
</ul> 
</aside> 
<div class="clear"></div> 
</div> 
<footer> 
<div class="footer-bottom"> 
<p>&copy; YourSite 2019. <a href="index.jsp">CCM</a></p> 
</div> 
</footer> 
</div> 
</body> 
</html> 
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8.2 _O/P SCREENS 


card maintenance 


home user admin 


Categories 
Introduction to Secure Bank Transaction TOY 


Home Page 


User Registration 


User Login 
= A credit card is different from a charge card, which requires the balance to be repaid in full each month. In contrast, 
Admin Login credit cards allow the consumers a continuing balance of debt. subject to interest being charged. A credit card also differs 
from a cash card, which can be used like currency by the owner of the card. 
About us 


Secure Bank 


Elliptic-curve cryptography (ECC) is an approach to A bank is a financial institution that accepts deposits from the public and creates credit. Lending activities can be 


public-key cryptography based on the algebraic 
sicichiae af elliptic carvex aver Gude Gebte performed either directly or indirectly through capital markets. Due to their importance in the financial stability of a 


country, banks are highly regulated in most countries. Most nations have institutionalized a system known as fractional 


reserve banking under which banks hold liquid assets equal to only a portion of their current liabilities 


Helpful Links 


Home 


Ahant Ae 


Categories 2 
User Registration LR» 
Home Page 


User Registration 


User Login 
Admin Login Name: akila 
Contact H 9876543210 
Helpful Links 
Email: akila@gmail.com 
Home Account Number: 9876543210123456 
AbontAs Card Number: 878618671861587 
Contact As 
Expiry date & 30-11-2020 
Bank : sbi 
Branch : trichy 
Address: kk nagar 
UserName: akila 
Password: - 
C-Password: - 
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Home Page 
User Registration 
User Login 


Admin Login 
Helpful Links 


Home 
About As 


Contact As 


card maintenance 


home user admin about as contact 


Home Page 
User Registration 
User Login 


Admin Login 
Helpful Links 


Home 
About As 


Contact As 
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User Login 


User name 


Password 


Categories 


User Registration 


Home Page 
User Registration 
User Login 


Admin Login 


Helpful I 


Home 
About As 
Contact As 
X:275 
Y¥:202 
275 202 
Submit 
. . 
User Registration 
Home Page 


User Registration 
User Login 


Admin Login 


Helpful Links 


Home 


About As 


Contact As 


270 198 


Submit 
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Categories 2 
User Registration ia 
Home Page 


User Registration 


User Login 


Admin Login 


Helpful Links 


Home 


About As 


Contact As 


X:268 
Y:197 


268 197 


Submit 


card maintenance 


homepage deposit +s withdraw —_—transaction _logout 


The address bar tums green indicating that the site is 
secured with an SSL Certificate that meets the 
Extended Validation Standard. 


Available balance 


Id Event Amount ACC_number Date 


deposit 15000 23-11-2019 


withdraw 5000 23-11-2019 
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card maintenance 


homepage deposit + withdraw _—transaction _logout 


The address bar tums green indicating that the site is 
secured with an SSL Certificate that meets the 
Extended Validation Standard. 


Available balance 
Deposit Amount — {2000 


card maintenance 


Banking 


Submit 


homepage deposit withdraw transaction logout 


me — 


Banking Zz 


The address bar tums green indicating that the site is 
secured with an SSL Certificate that meets the _—_ = 
Extended Validation Standard 


Available balance 12000 


Withdraw Amount — [i00 


Submit 
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card maintenance 


homepage deposit withdraw transaction logout 


Welcome akila 


. 
The address bar tums green indicating that the site is Transaction 
secured with an SSL Certificate that meets the 

Extended Validation Standard. 


Transaction 
Account Number 9876543210123458 


Trans Amount 


Submit 


home user 


tego 


Home Page 
User Registration 
User Login 


Admin Login User name 


Helpful Links Password 


Home 


About As 


Contact As 
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